<template>
    <view class="page">

        <view class="items">
            <view class="left">
                <view class="type md4Text lgrey">
                    学校
                </view>

                <view class="name  md2Title ">
                    <input type="text" v-model="name" placeholder="请输入" />
                </view>
            </view>

            <!-- <view class="right">
				<image src="../../static/imgs/right.png" mode=""></image>
			</view> -->
        </view>

        <view class="items" @click="show_edu = true;">
            <view class="left">
                <view class="type md4Text lgrey">
                    学历
                </view>

                <view class="name  md2Title ">
                    <input type="text" :value="edu" placeholder="请选择" :disabled="true" />
                </view>
            </view>

            <view class="right">
                <image src="../../static/imgs/right.png" mode=""></image>
            </view>
        </view>
        <u-picker :show="show_edu" :columns="eduList" @confirm="setEdu" @cancel="show_edu = false;">
        </u-picker>

        <view class="items">
            <view class="left">
                <view class="type md4Text lgrey">
                    专业
                </view>

                <view class="name  md2Title ">
                    <input type="text" v-model="major" placeholder="请输入" />
                </view>
            </view>

            <!-- <view class="right">
				<image src="../../static/imgs/right.png" mode=""></image>
			</view> -->
        </view>

        <view class="items" @click="show_year = true;">
            <view class="left">
                <view class="type md4Text lgrey">
                    时间段
                </view>

                <view class="name  md2Title " style="display: flex;">
                    <input type="text" :value="start ? start+'-'+end : ''" placeholder="请选择" :disabled="true">
                </view>
            </view>

            <view class="right">
                <image src="../../static/imgs/right.png" mode=""></image>
            </view>
        </view>
        <u-picker :show="show_year" :columns="yearList" @confirm="setYear" @cancel="show_year = false;">
        </u-picker>

        <view class="items" @click="eduContent">
            <view class="left">
                <view class="type md4Text lgrey">
                    在校经历
                </view>

                <view class="name  md2Title ">
                    <input type="text" :value="content" placeholder="选填 请输入" :disabled="true" />
                </view>
            </view>

            <view class="right">
                <image src="../../static/imgs/right.png" mode=""></image>
            </view>
        </view>

        <view style="margin-top: 60rpx;">
            <u-button type="primary" @click="save()">确定</u-button>
        </view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                name: '',
                edu: '',
                eduList: [],
                show_edu: false,
                major: '',
                start: '',
                end: '',
                show_year: false,
                yearList: [],
                content: '',
                
                is_resume: false,
                edit_index: -1
            };
        },
        onLoad() {
            this.getEduList();
            var year = new Date().getFullYear(), list = [[], []], i = 0;
            while(i < 60) {
                list[0].push(year - i);
                list[1].push(year + 4 - i);
                i++;
            }
            this.yearList = list;
            
            var resume = uni.getStorageSync('resume');
            if(resume) {
                this.is_resume = true;
                var edit_index = uni.getStorageSync('edit_edu_index');
                if(!isNaN(edit_index)) {
                    uni.removeStorageSync('edit_edu_index');
                    this.edit_index = edit_index;
                    if(resume.eduData[edit_index]) {
                        this.name = resume.eduData[edit_index].name;
                        this.start = resume.eduData[edit_index].start;
                        this.end = resume.eduData[edit_index].end;
                        this.content = resume.eduData[edit_index].content;
                        this.edu = resume.eduData[edit_index].edu;
                        this.major = resume.eduData[edit_index].major;
                    }
                }
            }
        },
        onShow() {
            var content = uni.getStorageSync('zxjl');
            if(content) {
                this.content = content;
                uni.removeStorageSync('zxjl');
            }
        },
        methods: {
            getEduList() {
                this._ajax({
                    url: '/api/index/getEduList',
                    success: res => {
                        if (res.code == 1) {
                            this.eduList = [res.data];
                        }
                    }
                })
            },
            setEdu(e) {
                this.show_edu = false;
                this.edu = e.value[0];
            },
            setYear(e) {
                if(e.value[1] - e.value[0] < 0) {
                    return this._toast('毕业时间选择错误');
                }
                this.start = e.value[0];
                this.end = e.value[1];
                this.show_year = false;
            },
            save() {
                if(!this.name) {
                    return this._toast('请输入学校名称');
                }
                if(!this.edu) {
                    return this._toast('请选择学历');
                }
                if(!this.major) {
                    return this._toast('请输入专业名称');
                }
                if(!this.start) {
                    return this._toast('请选择时间段');
                }
                if(this.is_resume) {
                    this._ajax({
                        url: '/api/user/updateResume',
                        data: {
                            name: this.name,
                            start: this.start,
                            end: this.end,
                            edu: this.edu,
                            major: this.major,
                            content: this.content,
                            index: this.edit_index,
                            step: 5
                        },
                        success: res => {
                            if(res.code == 1) {
                                uni.setStorageSync('resume', res.data);
                                this._toBack();
                            }else{
                                this._toast(res.msg);
                            }
                        }
                    }, 1);
                }else {
                    this._ajax({
                        url: '/api/user/eduData',
                        data: {
                            name: this.name,
                            start: this.start,
                            end: this.end,
                            edu: this.edu,
                            major: this.major,
                            content: this.content,
                        },
                        success: res => {
                            if(res.code == 1) {
                                uni.setStorageSync('user', res.data);
                                if(res.data.step == 6) {
                                    uni.reLaunch({
                                        url: '/pages/views/tabBar/home'
                                    });
                                }
                            }else{
                                this._toast(res.msg);
                            }
                        }
                    }, 1);
                }
            },
            eduContent() {
                uni.setStorageSync('zxjl', this.content);
                this._toView('login/edu_content')
            }

        }
    };
</script>

<style scoped lang="less">
    .page {
        padding: 0 32upx;
        background-color: #fff;

        .items {
            width: 100%;
            height: 156upx;
            border-bottom: 2upx solid #e5e5e5;
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 0 20upx;

            .photo {
                image {
                    width: 112upx;
                    height: 112upx;
                }
            }

            .left {
                flex: 1;

                .name {
                    font-weight: bold;
                    margin-top: 30upx;

                }
            }

            .right {
                margin-left: 30rpx;

                image {
                    width: 48upx;
                    height: 48upx;
                }
            }
        }
    }
</style>
